.center-column {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
}

.column-left {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  height: 100%;
}

.center {
  display: flex;
  flex-direction: row;
  height: 100%;
}

.center-left {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  height: 100%;
}

.wrapper {
  @extend .center-column;
  width: 99%;
  min-height: 99vh;
  justify-content: flex-start;
  margin-left: auto;
  margin-right: auto;
}

.container {
  @extend .center;
  width: 100%;
  align-items: flex-start;
}

.aside {
  @extend .column-left;
  width: 300px;
  min-height: 500px;
  padding: 1rem;
}

.content {
  // @extend .center;
  display: flex;
  align-items: flex-start;
  border-left: 1px solid #ccc;
  width: calc(100% - 300px);
  justify-content: flex-start;
  padding: 1rem;
}

.header {
  height: 100px;
  @extend .center-left;
  border: 1px solid #ccc;
  width: 100%;
  padding-left: 1rem;
}
